app = @bhv

app.directive('analysisPlay', ->
  restrict: 'A'
  replace: false
  scope: title: '@'
  controller: ($scope)->
    @options =
      title:
        text: $scope.title
        x: 'center',
        y: 'center',
        itemGap: 20,
        textStyle :
          color : '#FFF',
          fontFamily : '微软雅黑',
          fontSize : 28,
          fontWeight : 'bolder'
      tooltip: show: false
      legend: show: false, data: ['电视', '平板', '手机', '电脑']
      toolbox: show: false
      calculable : false,
      series:[
        {
          name: '播放时间'
          type: 'pie'
          radius: ['50%', '70%']
          itemStyle:
            normal:
              label:
                position: 'insideBottom'
                formatter: -> "" # #{arguments[1]}
                textStyle:
                  color: '#FFF'
                  fontSize: 18
                  align: 'left'
              labelLine:
                lineStyle: width: 0
                length: 18
          data: [
            {value:335, name:'电视'}
            {value:310, name:'平板'}
            {value:234, name:'手机'}
            {value:135, name:'电脑'}
          ]
        }
      ]
      color: ['#FF4C38', '#3DCFFF', '#FEEB15', '#24EFC3']



  link: ($scope, element, attrs, ctrl)->
    $element = $(element)
    chart = echarts.init($element[0])
    chart.setOption ctrl.options

    setMarkPointList = ->
      positionList = chart.chart.pie.series[0].data
      imageMap =
        "电视": 'image://image/analysis-tv.png'
        "平板": 'image://image/analysis-ipad.png'
        "手机": 'image://image/analysis-phone.png'
        "电脑": 'image://image/analysis-computer.png'

      setMarkPoint =  (item)->
        name = item.name
        symbol = imageMap[name]
        x = item.__labelX - 16
        y = item.__labelY

        chart.addMarkPoint(0, {
          symbol: symbol
          symbolSize: 16
          data: [{name: name, x: x, y:y}]
        })

      for item in positionList
        setMarkPoint item

    setMarkPointList()
)